export default class extends Phaser.State{
    constructor () {
        super()
        this.jsonData = []
        this.scoreText = 0
    }
    preload() {
        this.load.image('bg', 'assets/score_bg.png');
        this.load.image('container', 'assets/score_container.png');
        this.load.image('again', 'assets/again_btn.png');
        this.load.image('share', 'assets/rank_btn.png');
        this.load.image('star1', 'assets/star1.png');
        this.load.image('star2', 'assets/star2.png');
        this.load.image('star3', 'assets/star3.png');
        this.load.image('easel', 'assets/head_img_mask.png');
        this.load.image('mask', 'assets/info_mask.png');

        //头像
        for(let i =0; i<this.jsonData.length; i++){
            if (i <= 5) {
                this.load.image('profileImg' + i, this.jsonData[i].profileImg);
            } 
        }
    }
    init() {
        this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
        this.scoreText = this.state.states.play.score
        this.cityId = localStorage.getItem('cityId')
        this.jsonData = this.state.states.play.jsonData
    }
    create() {
        var bg = this.add.image(0, 0,'bg')
        game.add.text(110, 1200, this.scoreText, { fontSize: "40px", fill: "#fff" }); 
        var container = this.add.image(0, 0,'container')
        game.add.text(280, 260, this.scoreText, { fontSize: "80px", fill: "#ffe948" });

        bg.scale.set(1.17,1.1)
        container.scale.set(1.17,1.1)

    
        // 排行
        for(let i =0; i<this.jsonData.length; i++){
            if (i <= 5) {
                var container = game.add.group();
                var name = this.jsonData[i].name
                var score = this.jsonData[i].score
                //左侧图标
                if(i <= 2){
                    var star = container.create(60, 470 + i * 110, 'star' + (i + 1))
                    star.scale.setTo(1.3,1.3)
                } else {
                    var rank = game.add.text(80, 810 + (i-3) * 110, i + 1, { fontSize: "35px", fill: "#32b670" }); 
                }
                // mask
                var easel = container.create(145, 465 + i * 110, 'easel' )
                easel.scale.setTo(0.6, 0.6)
                var bmd = game.make.bitmapData(132, 132);
                bmd.alphaMask('profileImg' + i , 'easel');
                var profileImg = container.create(145, 465 + i * 110 , bmd )
                profileImg.scale.setTo(0.6, 0.6)

                //name
                if(name.length > 9){
                    name = name.substr(0,9)+'...';
                }
                game.add.text(260, 485 + i * 110, name, { fontSize: "30px", fill: "#000" });
                //score 
                game.add.text(580, 485 + i * 110, score, { fontSize: "30px", fill: "#000" }); 
            }    
        }

        //mask
        var mask = this.add.image(19, 887,'mask')
        mask.scale.set(1.17,1.1)
        
        // again
        var again = this.add.image(window.gameWidth / 2, 1230,'again')
        again.anchor.setTo(0.5, 0.5)
        //share
        var share = this.add.image(window.gameWidth / 2, 1100,'share')
        share.anchor.setTo(0.5, 0.5)

        again.inputEnabled = true
        share.inputEnabled = true

        again.events.onInputDown.add( () => {
            location.reload() 
        }, again )
        share.events.onInputDown.add( () => {
            location.href = `http://wechat.yxfwpt.com/wap/h520200625?score=${this.scoreText}&city=${this.cityId}`
        }, share )
    }
}